<template>
	<view>
<!-- 		<cu-custom bgColor="bg-gradual-blue" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">查看成绩</block>
		</cu-custom> -->
		<view class="cu-bar bg-white search fixed" >
			<view class="search-form round">
				<text class="cuIcon-search"></text>
				<input :adjust-position="false" type="text" v-model="searchvalue" placeholder="请输入考试名称" confirm-type="search" />
			</view>
			<view class="action"><button @click="doSearch" class="cu-btn bg-green shadow-blur round">搜索</button></view>
		</view>
		<view :style="[{ 'margin-top': 50  + 'px' }]">
			<scroll-view scroll-y="true" class="page show" @scrolltolower="getTolower">
				<view class="cu-list menu" v-for="(item, index) in examdata" :key="item.id">
					<view class="cu-item ">
						<view class="content padding-tb-sm">
							<view>
								<text class="text-blue margin-right-xs">试卷名称:</text>
								{{ item.exam.name }}
							</view>
							<view class="text-gray text-sm">
								<text class="cuIcon-edit  text-blue margin-right-xs">试卷标题:</text>
								{{ item.exam.title }}
							</view>
							<view class="text-gray text-sm">
								<text class="cuIcon-timefill text-blue margin-right-xs">开始时间:</text>
								{{ item.exam.stime }}
							</view>
							<view class="text-gray text-sm">
								<text class="cuIcon-time text-blue margin-right-xs">结束时间:</text>
								{{ item.exam.etime }}
							</view>
							<view class="text-gray text-sm">
								<text class="cuIcon-sort text-blue margin-right-xs">所属科目:</text>
								{{ item.subpro.subname }}/{{ item.subpro.proname }}
							</view>
						</view>
						<view class="action">
							<button class="cu-btn round bg-green shadow" @click="doExam(item)">
								<text class="cuIcon-notice"></text>
								查看成绩
							</button>
						</view>
					</view>
				</view>
					<ShowNull :isConnected="isConnected"></ShowNull>
			</scroll-view>
		</view>

		<view class="cu-modal" :class="modalName == 'DialogModal2' ? 'show' : ''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end">
					<view class="content">您的成绩</view>
					<view class="action" @tap="hideModal"><text class="cuIcon-close text-red"></text></view>
				</view>
				<view class="padding-xl">
					<view class="cu-card case">
						<view class="cu-bar bg-white margin-top">
							<view class="action">
								<text class="cuIcon-title text-orange "></text>
								考试名称
							</view>
							<view class="action">
								<view class="cu-tag round bg-olive light">{{ curentitem.exam.name }}</view>
							</view>
						</view>

						<view class="cu-bar bg-white margin-top">
							<view class="action">
								<text class="cuIcon-title text-orange "></text>
								试卷标题
							</view>
							<view class="action">
								<view class="cu-tag round bg-olive light">{{ curentitem.exam.title }}</view>
							</view>
						</view>

						<view class="cu-bar bg-white margin-top">
							<view class="action">
								<text class="cuIcon-title text-orange "></text>
								最高分
							</view>
							<view class="action">
								<view class="cu-tag round bg-olive light">{{ curentitem.maxFraction }}分</view>
							</view>
						</view>

						<view class="cu-bar bg-white margin-top">
							<view class="action">
								<text class="cuIcon-title text-orange "></text>
								参考次数
							</view>
							<view class="action">
								<view class="cu-tag round bg-olive light">{{ curentitem.doExamSize }}次</view>
							</view>
						</view>
					</view>
				</view>
				<view class="cu-bar bg-white">
					<view class="action margin-0 flex-sub  solid-left" @tap="hideModal">确定</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import uniList from '@/components/uni-list/uni-list.vue';
import uniListItem from '@/components/uni-list-item/uni-list-item.vue';
import ShowNull from '@/components/shownull.vue';
import { mapState } from 'vuex';
export default {
	components: { uniList, uniListItem,ShowNull },
	computed: mapState(['user', 'hasLogin']),
	onReady() {
		this.initData();
	},
	data() {
		return {
			isConnected:true,
			modalName: null,
			modalContent: '',
			CustomBar: this.CustomBar,
			examdata: [],
			scrollTop: 0,
			InputBottom: 0,
			old: {
				scrollTop: 0
			},
			searchvalue: '',
			searchval: 'name',
			todata: {},
			curentitem: {
				doExamSize: '',
				exam: '',
				maxFraction: '',
				subpro: {}
			}
		};
	},
	methods: {
		hideModal() {
			this.modalName = null;
			this.todata = {};
		},
		
		initData: function() {
			if (this.hasLogin) {
				var data = {
					workno: this.user.workno,
					searchvalue: this.searchvalue,
					searchval: this.searchval
				};
				data = encodeURI(JSON.stringify(data));
				///examonline/hasExam
				uni.request({
					url: '/examonline/mobile/preCXCJ',
					data: {
						data
					},
					dataType: 'GET',
					success: res => {
						let resdata = JSON.parse(res.data);
						this.examdata = resdata.data;
						if(this.examdata.length==0){
							this.isConnected=false;
						}
					}
				});
			}
		},
		doExam: function(item) {
			if (this.hasLogin) {
				this.modalName = 'DialogModal2';
				this.curentitem = item;
			} else {
				uni.showToast({
					title: '无法获取登陆信息，请重新登陆！',
					duration: 2000
				});
			}
		},
		InputFocus: function(e) {
			this.InputBottom = e.detail.height;
		},
		InputBlur: function(e) {
			this.InputBottom = 0;
		},
		doSearch: function() {
			this.initData();
		},
		upper: function(e) {
			console.log(e);
		},
		getTolower: function(e) {
			console.log(e);
		},
		scroll: function(e) {
			console.log(e);
			this.old.scrollTop = e.detail.scrollTop;
		},
		goTop: function(e) {
			this.scrollTop = this.old.scrollTop;
			this.$nextTick(function() {
				this.scrollTop = 0;
			});
		}
	},onReady() {
			if (this.hasLogin) {
				this.initData();
			} else {
				uni.navigateTo({
					url: '../login/login'
				});
			}
	}
};
</script>

<style></style>
